<!--
 * @Author: your name
 * @Date: 2022-03-30 20:48:41
 * @LastEditTime: 2022-03-30 23:23:37
 * @LastEditors: your name
 * @Description: 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 * @FilePath: \edu-web\src\views\Recruitment.vue
-->
<template>
  <div v-if="recruitmentData">
    <sub-header pathName="/recruitment" :isShowTab="false"> </sub-header>
    <div class="rypage container">
      <div class="category_title">
        <h2>{{ title }}</h2>
        <h3>{{ subTitle }}</h3>
      </div>
      <div class="rybody">
        <hr />
        <div class="row">
          <div class="col-sm-12" v-html="contentHtml"></div>
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import SubHeader from '@/components/subHeader/subHeader.vue'
import { getCateData } from '@/service/getData.js'
import { isEn, escapeHtml } from '@/common/util';

export default {
  components: {
    'sub-header': SubHeader
  },
  data() {
    return {
      recruitmentData: null,
      cateId: 12
    }
  },
  computed: {
    title() {
      return isEn() ? this.recruitmentData.title_en : this.recruitmentData.title
    },
    subTitle() {
      return isEn() ? this.recruitmentData.extra_en : this.recruitmentData.extra
    },
    contentHtml() {
      return isEn() ? escapeHtml(this.recruitmentData.content_en) : escapeHtml(this.recruitmentData.content)
    }
  },
  created() {
    this.getCate()
  },
  methods: {
    async getCate() {
      let res = await getCateData(this.cateId, 1)
      if (res && res.content && res.content.length > 0) {
        this.recruitmentData = res.content[0]
      }
    }
  }
}
</script>
<style scoped>
.category_title {
  width: 180px;
  margin: 0px auto;
  text-align: left;
}

.category_title h2 {
  color: #233876;
  font-size: 22px;
  font-weight: normal;
}

.category_title h3 {
  color: #aaa;
  font-size: 14px;
  font-weight: normal;
  margin-top: 7px;
}

.rybody {
  margin-top: 42px;
}

.rybody p {
  text-indent: 2em;
  line-height: 26px;
  letter-spacing: 1px;
}

.rybody .catpic1 {
  border-top: 1px solid #eee;
  padding: 4px 0px;
  margin-bottom: 15px;
  border-bottom: 1px solid #eee;
  text-align: center;
}

.rybody .catpic1 img {
  display: inline-block;
  width: 100%;
}
</style>